import React, {Component} from 'react';
import {   Button, Modal, Form, Input} from 'antd';
const FormItem = Form.Item;


class Movie extends Component {

    constructor(props) {
        super(props);
        this.state = {
            name: this.props.uiData.data.name,
            synopsis: this.props.uiData.data.synopsis
        };
    }


    componentWillReceiveProps(nextProps) {
        this.setState({
            name: nextProps.uiData.data.name,
            synopsis: nextProps.uiData.data.synopsis
        });
    }

    changeName(e) {
        this.setState({
            name: e.target.value
        });
    }
    changeSynopsis(e) {
        this.setState({
            synopsis: e.target.value
        });

    }
    goform(e) {

        let form = {
            key:this.props.uiData.data.key,
            name:this.state.name,
            synopsis:this.state.synopsis
        }
        this.props.doClick(form);


    }

    render() {
        const { getFieldProps } = this.props.form;
        return (
            <Modal title={this.props.uiData.text}
                visible={this.props.uiData.show}
                footer={[]}
                onCancel={this.props.close}>
                {/** 电影输入框 */}
                <Form horizontal >
                    <FormItem
                        label="电影名："
                        labelCol={{ span: 6 }}
                        wrapperCol={{ span: 14 }}>
                        <Input  placeholder="请输入电影名称" {...getFieldProps('movieName') } value = {this.state.name} onChange={this.changeName.bind(this) }/>
                    </FormItem>
                    <FormItem
                        label="电影简介："
                        labelCol={{ span: 6 }}
                        wrapperCol={{ span: 14 }}>
                        <Input type="textarea"  rows="3" {...getFieldProps('movieSynopsis') } value = {this.state.synopsis}  onChange={this.changeSynopsis.bind(this) }/>
                    </FormItem>
                    <FormItem wrapperCol={{ span: 16, offset: 6 }} style={{ marginTop: 24 }}>
                        <Button type="primary" onClick={this.goform.bind(this)}>确定</Button>
                    </FormItem>
                </Form>
            </Modal>
        );
    }
}
Movie = Form.create()(Movie);


export default Movie;